<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="../layui/css/layui.css">
  <title>Document</title>
  <style>
    img {
      width: 50px;
      height: 50px;
    }

    .shangchuan-box {
      width: 438px;
      position: relative;
    }

    .zhegai1 {
      width: 438px;
      height: 32px;
      background-color: #555;
      position: absolute;
      top: 0;
      left: 0;
    }

    .zhegai2 {
      width: 315px;
      height: 25px;
      background-color: #555;
      position: absolute;
      top: 32px;
      right: 0;
    }

    .zhegai3 {
      width: 79px;
      height: 25px;
      padding-left: 20px;
      background-color: #555;
      position: absolute;
      top: 32px;
      left: 0;
      line-height: 20px;
      font-size: 14px;
      color: #fff;
    }

    .zhegai4 {
      width: 438px;
      height: 3px;
      background-color: #555;
      position: absolute;
      top: 57px;
      left: 0;
    }

    .yulan {
      width: 404px;
      height: 274px;
      border: 17px #555 solid;
      position: absolute;
      top: 60px;
      left: 0;
    }

    #com-submit-btn {
      width: 438px;
      height: 40px;
      background-color: #888;
      color:#fff;
      outline: none;
    }
  </style>
</head>

<body>
  <%- include('head',{title:'album',username:username })%>
    <h2>
      <%- username %>的相册<%- %>
    </h2>

    <% result.forEach((item,idx)=>{ %>
      <div class="item-box">
        <div>
          <a href="">
            <%- item.imgs %>
          </a>
        </div>
      </div>
      <% }) %>

        <div class="form-group shangchuan-box">
          <div class="zhegai1"></div>
          <div class="zhegai2"></div>
          <div class="zhegai3">选择图片→</div>
          <div class="zhegai4"></div>
          <div class="yulan"></div>
          <textarea class="form-control" name="content" id="content" cols="60" rows="20" placeholder="Content"
            readonly></textarea>
        </div>

        <button type="submit" id="com-submit-btn" class="btn btn-success">确定上传</button>
</body>
<script src="http://47.104.209.44/base/js/jquery-1.10.1.min.js"></script>
<script src="../layui/layui.all.js"></script>

<script src="/xheditor/xheditor-1.2.2.min.js"></script>
<script src="/xheditor/xheditor_lang/zh-cn.js"></script>

<script>



  function queryString(key) {
    return location.search
      .replace('?', '')
      .split('&')
      .reduce((total, item) =>
        (total[item.split('=')[0]] = decodeURIComponent(item.split('=')[1])) && total
        , {})[key] || ''
  }



  $(document).on("click", "#com-submit-btn", function () {
    if ($("#content").val()) {
      $.ajax({
        url: `/upload`,
        type: "post",
        data: {
          aid: queryString('aid'),
          imgs: $("#content").val(),
        },
        success(res) {
          alert(res.msg);
          if (res.type) {
            window.location.reload();
          }
        }
      })
    } else {
      alert('请先选择图片')
    }
  })

  $(document).on('click', '#xheSave', function () {
    console.log(666);
  })

  // $("#content").xheditor(); // 简单的实例化 
  $(pageInit);
  function pageInit() {
    $.extend(XHEDITOR.settings, { shortcuts: { "ctrl+enter": submitForm } });
    // $("#ele").xheditor();
    $("#content").xheditor({   //初始化 富文件编辑框
      html5Upload: false,
      upMultiple: "1",

      upLinkRrl: "upload.html",
      upLinkExt: "zip,rar,txt",

      upImgUrl: "/comment/uploadImg",   // 图片上传的服务器  
      upImgExt: "jpg,jpeg,gif,png",

      upFlashUrl: "upload.php",
      upFlashExt: "swf",

      upMediaUrl: "upload.php",
      upMediaExt: "wmv,avi,wma,mp3,mid"

    });
  };

  function insertUpload(arrMsg) {
    console.log(arrMsg);
    var i, msg;
    for (var i = 0; i < arrMsg.length; i++) {
      msg = arrMsg[i];
      console.log(msg);
      $("#uploadList").append('<option value="' + msg.id + '">' + msg.localname + '</option>')
    }
  };

  function submitForm() {
    $("#frmDemo").submit();
  }
</script>

</html>